<template>
  <div>
    <DateRangePicker
      v-model:startDate="props.query.monthStart"
      v-model:endDate="props.query.monthEnd"
      type="monthrange"
      format="YYYY-MM"
      valueFormat="YYYY-MM"
      style="width: 220px;"
      :clearable="false"
      @change="onChange"
    />
  </div>
</template>

<script setup lang="ts">
import DateRangePicker from '@/components/form-item/DateRangePicker.vue'
interface Props {
  query: any
}
const props = defineProps<Props>()
const emit = defineEmits()
const onChange = () => {
  emit("search")
}
</script>
